<template>
    <el-container>
        <el-main>
            <el-table
                    :data="processData"
            >

                <el-table-column
                        prop="id"
                        label="流程ID"
                >
                </el-table-column>

                <el-table-column
                        prop="key"
                        label="流程key"
                >
                </el-table-column>

                <el-table-column
                        prop="name"
                        label="流程名称"
                >
                </el-table-column>

                <el-table-column
                        prop="description"
                        label="流程描述"
                >
                </el-table-column>

                <el-table-column
                        prop="version"
                        label="版本"
                >
                </el-table-column>

                <el-table-column
                        prop="name"
                        label="操作"
                        width="300"
                >
                    <template slot-scope="scope">
                        <el-button @click="startProcess(scope.row)" size="mini">发起流程</el-button>
                    </template>
                </el-table-column>

            </el-table>
        </el-main>
    </el-container>
</template>

<script>
    import {getProcessDefineList} from '../../api/process.api'

    export default {
        name: "ProcessManager",
        data() {
            return {
                processData: []
            }
        },
        methods: {
            load() {
                getProcessDefineList().then((res) => {
                    this.processData = res.data;
                })
            },
            startProcess(row){
                this.$router.push({
                    name: 'apply-manager',
                    query: {
                        processId: row.id
                    }
                });
            }
        },
        created() {
            this.load();
        }
    }
</script>

<style scoped>

</style>
